<template>
	<div class="container" style="padding-top: 50px;">
		<div>
			<div v-if="flag" class="alert alert-info" style="margin-top: 10px;">
				<span>你已经登录,无需注册</span>	
			</div>
			<div class="alert alert-success">用户注册</div>
			<div class="input-control has-icon-left" style="margin-bottom: 10px;">
				<input style="width: 100%;" id="inputAccountExample1" type="text" class="form-control" placeholder="用户号" v-model="uidModel" />
				<label for="inputAccountExample1" class="input-control-icon-left"><i class="icon icon-user "></i></label>
			</div>
			<div class="input-control has-icon-left" style="margin-bottom: 10px;">
				<input style="width: 100%;" id="inputAccountExample1" type="text" class="form-control" placeholder="用户名" v-model="unameModel" />
				<label for="inputAccountExample1" class="input-control-icon-left"><i class="icon icon-user "></i></label>
			</div>
			<div class="input-control has-icon-left" style="margin-bottom: 10px;">
				<input style="width: 100%;" id="inputEmailExample1" type="password" class="form-control" placeholder="密码" v-model="upwdModel" />
				<label for="inputEmailExample1" class="input-control-icon-left"><i class="icon icon-envelope "></i></label>
				<label for="inputEmailExample1" class="input-control-icon-right"><i class="icon icon-check"></i></label>
			</div>
			<div class="input-radio" style="margin-bottom: 5px;">
			性别:
			<label for="male">
				<input type="radio" id="male" name="sex" value="男" v-model="usexModel" checked="checked">男
            </label>
            <label for="female">
				<input type="radio" id="female" name="sex" value="女" v-model="usexModel">女
            </label>
			</div>
			<button class="btn btn-primary" type="button" @click="onRegist">注册</button>
			&nbsp;&nbsp;
			<button class="btn btn-primary" type="button" @click="back">返回</button>
		</div>
	</div>
</template>

<script>
export default {
	name: 'regist',
	data() {
		return {
			unameModel: '',
			upwdModel: '',
			uidModel: '',
			usexModel: '',
			errorText: '',
			userlogname: '',
			flag: this.$store.state.loginFlag
		};
	},
	computed: {
		
	},
	methods: {
		onRegist() {
			const config={
				method: 'post',
				url: 'http://localhost:8080/json/user/regist',
				data: {
				uname: this.unameModel,
				upwd: this.upwdModel,
				uid: this.uidModel,
				usex: this.usexModel
				}
			}
			
			this.$axios(config).then(result => {
				console.log(result.data);
				if(result.data.status==true){
					this.showlogname = true;
					this.userlogname = result.data.user.uname;
					window.localStorage.setItem('loginFlag',true);
					// this.$router.push('/')
					this.$message({
						message: '注册成功!',
						type: 'success'
					});
				} else {
					this.$message.error('注册失败~');
				}
			})
		},
		back(){
			this.$router.push({name:"center"});
		}
	}
};
</script>

<style>
.login {
	padding-top: 50px;
}
.input-radio {
	font-size: 15px;
	color: #777;
}
</style>
